<script>
var ptable=null, tableId='ID_master_table';
layui.config({
	base: '#(ctx)/manage/_assets/libs/layui/extends/'
}).extend({
	treeGrid:'treeGrid'
}).use(['jquery', 'treeGrid', 'layer'], function() {
	var $=layui.jquery, treeGrid=layui.treeGrid, layer=layui.layer;
	ptable = treeGrid.render({
		id : tableId,
		elem : "#" + tableId,
		idField : "id", ### 必須字段
		url : "#(ctx)/manage/goodsCategory/ajaxSearch",
		cellMinWidth : 100,
		### toolbar : '#ID_master_table_toolbar',
		treeId : "id", ### 树形id字段名称
		treeUpId : "parentId", ### 树形父id字段名称
		treeShowName : "name", ### 以树形式显示的字段
		heightRemove : [".dHead",140],
		height : '100%',
		isFilter : false,
		iconOpen : false, ### 是否显示图标【默认显示】
		isOpenDefault : true, ### 节点默认是展开还是折叠【默认展开】
		loading : true,
		method : 'post',
		cols : [ [
			{ type : 'numbers' },
			{ field : 'status', width : 70, title : '状态', align : 'center',
				templet : function(d) {
					if(d.status == 'on'){
						return '<span class="layui-badge layui-bg-gray">启用</span>';
					} else {
						return '<span class="layui-badge">禁用</span>';
					}
				}
			},
			{ field : 'name', width : 300, title : '名称' },
			{ width : 140, title : '操作', align : 'center',
				templet : function(d) {
					var addBtn = '<a class="layui-btn layui-btn-xs" lay-event="add"><i class="layui-icon layui-icon-add-1"></i></a>';
					var editBtn = '<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i></a>';
					var delBtn = '<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i></a>';
					return addBtn + editBtn + delBtn;
				}
			},
			{ width : 60, title : '授权', align : 'center',
				templet : function(d) {
					var assignRole = '<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="assignRole"><i class="layui-icon layui-icon-auz"></i></a>';
					return assignRole;
				}
			},
			{ field : 'sortNum', width : 80, title : '排序', align : 'center'},
			{ field : 'code', width : 140, title : '代码' },
			{ field : 'remark', title : '描述' }
		] ],
		isPage : false,
		parseData : function (res) { ### 数据加载后回调
			return res;
		},
		onClickRow : function (index, data) {
		},
		onDblClickRow : function (index, data) {
			view(data);
		}
	});

	/*
	### 监听头部工具栏事件
	treeGrid.on('toolbar(LAY-master-table)', function(obj){
		if (obj.event === 'addTop'){
			addOrEdit('添加顶层商品分类', '#(ctx)/manage/goodsCategory/add?parentId=');
		};
	});
	*/

	### 用于响应各个按钮的点击事件
	$('#ID_btn_search').on('click', function() {
		reload();
	});

	$("#ID_add_top").on("click", function(){
		addOrEdit('添加顶层商品分类', '#(ctx)/manage/goodsCategory/add?parentId=');
	});

	$("#ID_expand_all").on("click", function(){
		expandAll();
	});

	### 监听操作列按钮事件
	treeGrid.on('tool(LAY-master-table)', function(obj) {
		var data = obj.data;
		if (obj.event === 'add') {
			addOrEdit('添加商品分类', '#(ctx)/manage/goodsCategory/add?parentId=' + data.id);
		} else if (obj.event === "edit") {
			addOrEdit('编辑商品分类', '#(ctx)/manage/goodsCategory/edit?id=' + data.id);
		} else if (obj.event === "del") {
			del(data);
		} else if (obj.event === "assignRole") {
			assignRole(data);
		}
	});

	### --------------- 以上是操作监听脚本 ---------------
	### --------------- 以下是操作执行脚本 ---------------

	function expandAll() {
		var treedata=treeGrid.getDataTreeList(tableId);
		treeGrid.treeOpenAll(tableId,!treedata[0][treeGrid.config.cols.isOpen]);
	}

	### 重载操作
	function reload(){
		treeGrid.reload(tableId, {
			where:{
				type: $("#ID_type").val()
			}
		});
	}

	### 新增或编辑操作
	function addOrEdit(title, actUrl){
		layer.open({
			type : 2,
			title : title,
			content : actUrl,
			maxmin : false,
			area : [ '800px', '520px' ],
			closeBtn : 1,
			shadeClose : false,
			anim : 1,
			moveOut : false,
			resize : false,
			btn : [ '保存', '取消' ],
			yes : function(index, layero) {
				var iframeWindow = window['layui-layer-iframe' + index],
					submitID = 'LAY-front-submit', ### 此ID必须和弹出iframe窗口中提交按钮的ID和Filter值一致
					submit = layero.find('iframe').contents().find('#' + submitID);

				### 监听提交
				iframeWindow.layui.form.on('submit('+ submitID + ')', function(data) {
					$.ajax({ ### 用Ajax替换弹窗中的提交
						url : "#(ctx)/manage/goodsCategory/ajaxSaveOrUpdate",
						type : "post",
						data : data.field, ### 获取提交的数据
						beforeSend : function(){layer.load(1);}, ### 防止重复操作
						complete : function(){layer.closeAll('loading');}, ### 解除防重复操作
						success : function(ret){
							if(ret.code == 0){
								### 提交 Ajax 成功后，静态更新表格中的数据
								reload(); ### 数据表格刷新
								layer.close(index); ### 关闭弹层
							} else {
								if(ret.msg){
									layer.alert(ret.msg, {icon: 0}); ### Ajax调用成功，但后台返回失败信息
								} else {
									layer.alert("操作失败！", {icon: 2});
								}
							}
						},
						error : function (e) { ### Ajax调用失败
							layer.alert("操作失败：" + e.responseText, {icon: 2});
						}
					});
					return false; ### 一定要返回False来阻止弹出窗口中提交按钮的再次提交
				});

				submit.trigger('click'); ### 这里触发弹出窗口的提交按钮
			}
		});
	}

	### 删除记录操作
	function del(data){
		layer.confirm('真的删除这条记录么？', function(index) {
			$.ajax({
				url : '#(ctx)/manage/goodsCategory/ajaxDel?id=' + data.id,
				type : "get",
				beforeSend : function(){layer.load(1);}, ### 防止重复操作
				complete : function(){layer.closeAll('loading');}, ### 解除防重复操作
				success : function(ret){
					if(ret.code == 0){
						layer.alert("删除成功！", {icon: 1});
						### 提交 Ajax 成功后，静态更新表格中的数据
						reload(); ### 数据刷新
						layer.close(index); ### 关闭弹层
					} else {
						if(ret.msg){
							layer.alert(ret.msg, {icon: 0});
						} else {
							layer.alert("操作失败！", {icon: 2});
						}
					}
				},
				error : function (e) {
					layer.alert("调用失败：" + e.responseText, {icon: 2});
				}
			});

		});
	}

	### 查看记录操作
	function view(data){
		layer.open({
			type : 2,
			title : "查看商品分类",
			content : '#(ctx)/manage/goodsCategory/view?id=' + data.id,
			maxmin : false,
			area : [ '800px', '500px' ],
			closeBtn : 1,
			shadeClose : false,
			anim : 1,
			moveOut : false,
			resize : false,
			btn : [ '关闭' ],
			yes : function(index, layero) {
				layer.close(index); ### 关闭弹层
			}
		});
	}

	### 指派角色操作
	function assignRole(data){
		layer.open({
			type : 2,
			title : "指派角色",
			content : '#(ctx)/manage/goodsCategory/assignRole?id=' + data.id,
			maxmin : false,
			area : [ '800px', '500px' ],
			closeBtn : 1,
			shadeClose : false,
			anim : 1,
			moveOut : false,
			resize : false,
			btn : [ '保存', '取消' ],
			yes : function(index, layero) {
				var iframeWindow = window['layui-layer-iframe' + index],
					submitID = 'LAY-front-submit', ### 此ID必须和弹出iframe窗口中提交按钮的ID和Filter值一致
					submit = layero.find('iframe').contents().find('#' + submitID);
				### 循环取出所有checkbox的值组成id字串，id之间用逗号隔开
				var roleIds="", count=0;
				### 监听提交
				iframeWindow.layui.form.on('submit('+ submitID + ')', function(data) {
					$.ajax({ ### 用Ajax替换弹窗中的提交
						url : "#(ctx)/manage/goodsCategory/ajaxAssignRole",
						type : "post",
						data : data.field, ### 获取提交的数据
						beforeSend : function(){layer.load(1);}, ### 防止重复操作
						complete : function(){layer.closeAll('loading');}, ### 解除防重复操作
						success : function(ret){
							if(ret.code == 0){
								### 提交 Ajax 成功后，静态更新表格中的数据
								reload(); ### 数据表格刷新
								layer.close(index); ### 关闭弹层
							} else {
								if(ret.msg){
									layer.alert(ret.msg, {icon: 0}); ### Ajax调用成功，但后台返回失败信息
								} else {
									layer.alert("操作失败！", {icon: 2});
								}
							}
						},
						error : function (e) { ### Ajax调用失败
							layer.alert("调用失败：" + e.responseText, {icon: 2});
						}
					});
					return false; ### 一定要返回False来阻止弹出窗口中提交按钮的再次提交
				});

				submit.trigger('click'); ### 这里触发弹出窗口的提交按钮
			}
		});
	}
});
</script>
